import React, {memo, useEffect,useState} from 'react';
import {shallowEqual, useDispatch, useSelector} from 'react-redux'
import { Table, Tag, Space, Divider, Button, Modal, Spin, message, Select, Form, Input, DatePicker} from 'antd';
import { modifyAirInfo } from '../../services';
import { NavLink } from 'react-router-dom/cjs/react-router-dom';
import { TimeProcess } from '../../utils';




//添加空调信息
const { Option } = Select;

export default memo(function ModifyAirInfo(props) {

    const [form] = Form.useForm();
    // console.log(props);
    const [airInfo, setAirInfo] = useState(props.location.query)
    // console.log(airInfo);
    const dispatch = useDispatch()
    //表单布局
    const layout = {
        labelCol: {
          span: 8,
        },
        wrapperCol: {
          span: 16,
        },
      };
      const tailLayout = {
        wrapperCol: {
          offset: 8,
          span: 16,
        },
      };

    

    const onFinish = (values) => {
        console.log(values);
        modifyAirInfo(values).then(res => {
            console.log(res);
            if(res.status == 200)
            {
                message.success(res.message)
            }else{
                message.error(res.message)
            }

        }).catch(err => {
            message.error(err)
        })

        
      };
    useEffect(() => {

    },[airInfo])

      const onWriteChange = (value) => {
        switch(value){
            case '维修中':
                form.setFieldsValue({
                    use_condition: 0
                });
                break;
            case '使用中':
                form.setFieldsValue({
                    use_condition: 1
                });
                break;
            case '未使用':
                form.setFieldsValue({
                    use_condition: 2
                });
                break;
            default:
                break;
        }
      }
    return (
        <div>
            <Divider orientation="left">修改空调信息</Divider>
            <Button type='link'><NavLink to="/admin/air_info" exact>返回</NavLink></Button>
            <Form
                {...layout}
                form={form}
                name="control-hooks"
                onFinish={onFinish}
                style={{
                    maxWidth: 600,
                }}
                initialValues={{
                    air_number: airInfo.air_number,
                    room_number: airInfo.room_number,
                    use_condition: airInfo.use_condition,
                    repair_times: airInfo.repair_times,
                    latest_repair_date: TimeProcess(airInfo.latest_repair_date)
                }}
                >
                <Form.Item
                    name="air_number"
                    label="空调编号"
                    rules={[
                    {
                        required: true,
                        message:"必须填写！"
                    },
                    ]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    name="room_number"
                    label="空调所在宿舍"
                    rules={[
                    {
                        required: true,
                        message:"必须填写！"
                    },
                    ]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    name="use_condition"
                    label="空调使用情况"
                    rules={[
                    {
                        required: true,
                        message:"必须填写！"
                    },
                    ]}
                >
                    <Select
                        onChange={onWriteChange}
                        allowClear
                    >
                        <Option value="0">维修中</Option>
                        <Option value="1">使用中</Option>
                        <Option value="2">未使用</Option>
                    </Select>
                </Form.Item>
                <Form.Item
                    name="repair_times"
                    label="修理次数"
                    rules={[
                    {
                        required: true,
                        message:"必须填写！"
                    },
                    ]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    name="latest_repair_date"
                    label="最近一次修理日期"
                    rules={[
                    {
                        required: true,
                        message:"必须填写！"
                    },
                    ]}
                >
                    <Input />
                </Form.Item>
                <Form.Item {...tailLayout}>
                    <Button type="primary" htmlType="submit">
                    提交
                    </Button>
                </Form.Item>
            </Form>

        </div>
    )
})